<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <title>检查项列表</title>
    <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.6/css/bootstrap.min.css">
    <link rel="stylesheet" href="../../static/css/style.css" th:href="@{/css/style.css}"/>
    <script>
        function confirmDelete(element) {
            var checkitemId = element.getAttribute("data-checkitem-id");
            if (confirm('确定要删除该检查项吗？')) {
                window.location.href = '/checkitems/delete/' + checkitemId;
            }
        }
    </script>
</head>
<body>
<div th:replace="~{common/layout :: header}"></div>
<div th:replace="~{common/layout :: sidebar}"></div>
<div class="container mt-5">
    <h1 class="mb-4">检查项列表</h1>
    <a href="/checkitems/add" class="btn btn-primary mb-3">添加新检查项</a>
    <hr>
    <table class="table table-bordered">
        <thead class="thead-dark">
        <tr>
            <th>检查项名称</th>
            <th>检查项内容</th>
            <th>意义</th>
            <th>备注</th>
            <th>操作</th>
        </tr>
        </thead>
        <tbody>
        <tr th:each="checkitem : ${checkitems}">
            <td th:text="${checkitem.ciName}"></td>
            <td th:text="${checkitem.ciContent}"></td>
            <td th:text="${checkitem.meaning}"></td>
            <td th:text="${checkitem.remarks}"></td>
            <td>
                <a th:href="@{/checkitems/view/{id}(id=${checkitem.ciId})}" class="btn btn-info btn-sm">详情</a>
                <a th:href="@{/checkitems/edit/{id}(id=${checkitem.ciId})}" class="btn btn-warning btn-sm">编辑</a>
                <button class="btn btn-danger btn-sm" th:data-checkitem-id="${checkitem.ciId}" onclick="confirmDelete(this);">删除</button>
            </td>
        </tr>
        </tbody>
    </table>
</div>
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.5.4/dist/umd/popper.min.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
</body>
</html>
``
